<%--
  Created by IntelliJ IDEA.
  User: YYY-Work
  Date: 2017/7/20
  Time: 9:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path;
%>
<!DOCTYPE>
<html>
<head>
    <title>新增音频专题</title>
    <meta charset="UTF-8">
    <title>AdminLTE | Data Tables</title>
    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>

    <!-- start分页需要使用以下三个js -->
    <script type="text/javascript" src="<%=basePath%>/js/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="<%=basePath%>/js/admin/utils.js"></script>
    <script type="text/javascript" src="<%=basePath%>/js/base/listtable.js"></script>
    <!-- end分页需要使用以上三个js -->

    <style type="text/css">
        .table th, .table td {
            text-align: center;
            vertical-align: middle !important;
        }
    </style>
</head>
<body class="skin-blue">

<!-- header logo: style can be found in header.less -->


<!-- getHeader -->
<s:action name="getHeader" namespace="/privilege" executeResult="true"/>
<div class="wrapper row-offcanvas row-offcanvas-left">
    <!-- Left side column. contains the logo and sidebar -->

    <!-- getMenus -->
    <s:action name="getMenus" namespace="/privilege" executeResult="true"/>

    <!-- Right side column. Contains the navbar and content of the page -->
    <aside class="right-side">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                <small>音频专题管理</small>
            </h1>
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">

                        <div class="box box-danger">

                            <div class="box-body">

                                <form id="addForm" action="javascript:searchVoiceSubject();" class="form-horizontal"
                                      name="searchForm">

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">频道名称</lable>
                                        <div class="col-sm-2">
                                            <input type="text" id="data_name" name="dataName" class="form-control">
                                        </div>

                                    </div>

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">频道描述</lable>
                                        <div class="col-sm-4">
                                            <textarea type="text" id="data_desc" name="dataDesc" rows='5' class="form-control" style="width: 100%"></textarea>
                                        </div>

                                    </div>

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">频道图片</lable>

                                        <div class="col-sm-4">
                                            <input type="file" id="img_url" name="imgUrlImage"/>
                                        </div>

                                    </div>

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">是否免费</lable>
                                        <div class="col-sm-2">
                                            <select class="form-control" id="freetype" name="freetype">
                                                <option value="0">免费</option>
                                                <option value="1">会员专享</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">是否可见</lable>
                                        <div class="col-sm-2">
                                            <select class="form-control" id="isIssueFlag" name="isIssueFlag">
                                                <option value="1">可见</option>
                                                <option value="2">不可见</option>
                                            </select>
                                        </div>
                                    </div>


                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">频道医生</lable>
                                        <div class="col-sm-2">

                                            <div id="stuff_name">
                                            </div>

                                            <input id="stuff_id" name="stuffId" style="display: none" />
                                            <input id="stuff_name_input" name="stuffName" style="display: none" />
                                            <div id="stuff_img">
                                            </div>

                                            <div>
                                                <button class="btn btn-success btn-xs" onclick="selectDoctor()" type="button">
                                                    选择
                                                </button>
                                                <button class="btn btn-danger btn-xs" onclick="removeSelectDoctor()" type="button">
                                                    移除
                                                </button>
                                            </div>


                                        </div>

                                    </div>

                                    <div class="form-group">
                                        <label class="col-sm-1 control-label"></label>

                                        <div class="controls col-sm-2">
                                            <button class="btn btn-success" onclick="addVoiceSubject()" type="button">新增</button>
                                        </div>
                                    </div>

                                </form>
                            </div><!-- /.box-body -->
                        </div><!-- /.box -->

                    </div><!-- /.box -->


                </div>
            </div>

        </section><!-- /.content -->
    </aside><!-- /.right-side -->
</div><!-- ./wrapper -->

<div class="modal fade" id="selectDoctorModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel">添加医生</h4>
                <div style="margin-top: 15px;vertical-align: middle;">
                    <form id="search-doctor-form">
                        <input type="text" id="stuff_search_name" name="stuffName" class="col-sm-3" style="padding-top: 3px;padding-bottom: 3px" placeholder="请输入医生姓名">
                        <input name="currentPage" type="text" value="1" style="display: none">
                        <input name="pageSize" type="text" value="100" style="display: none">
                    </form>
                    <button type="button" class="btn btn-primary btn-sm" style="margin-left: 15px" onclick="searchStuff()">查询</button>
                </div>
            </div>
            <div class="modal-body" id="doctor-list" style="height: 400px;max-height:400px;overflow:scroll">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

</body>

<script type="text/javascript" src="<%=basePath%>/js/admin/utils.js"></script>
<script type="text/javascript" src="<%=basePath%>/js/base/listtable.js"></script>
<link href="<%=basePath%>/css/fileinput.css" media="all" rel="stylesheet" type="text/css"/>
<link href="<%=basePath%>/themes/explorer/theme.css" media="all" rel="stylesheet" type="text/css"/>
<script src="<%=basePath%>/js/sortable.js" type="text/javascript"></script>
<script src="<%=basePath%>/js/fileinput.js" type="text/javascript"></script>
<script src="<%=basePath%>/js/locales/zh.js" type="text/javascript"></script>
<script src="<%=basePath%>/themes/explorer/theme.js" type="text/javascript"></script>

<script type="text/javascript">

    $("#img_url").fileinput({
        language: 'zh', //设置语言 
        showUpload: false, //是否显示上传按钮  
        showCaption: true,//是否显示标题  
        allowedPreviewTypes: ['image'],
        allowedFileTypes: ['image'],
        allowedFileExtensions: ['jpg', 'png'],
    });


    function addVoiceSubject() {
        var formData =new FormData($('#addForm')[0]);//
        $.ajax({
            type: "POST",
            url:"<%=basePath%>/voice/ajaxAddVoiceSubject.action",
            data:formData,
            async: false,
            contentType: false,
            processData: false,
            error: function(request) {
                alert("网络异常");
            },
            success: function(data) {
                data=JSON.parse(data);
                if (data.errorCode>=0)
                {
                    var recid=data.recid;
                    location.href="<%=basePath%>/voice/ajaxQueryVoiceSubjectDetail.action?recid="+recid;
                }else
                {
                    alert(data.errorMsg);
                }
            }
        });
    }


    function searchStuff() {
        var formData =new FormData($('#search-doctor-form')[0]);//
        $.ajax({
            type:"POST",
            url:"<%=basePath%>/stuff/ajaxQueryStuffForSelect.action",
            data:formData,
            async: false,
            contentType: false,
            processData: false,
            error: function(request) {
                alert("网络异常");
            },
            success: function(data) {
                data=JSON.parse(data);
                if(!Utils.isEmpty(data.content))
                {
                    $("#doctor-list").empty();
                    $("#doctor-list").append(data.content);
                }
            }
        });
    }

    function onStuffSelect(stuffid,stuffName,iconUrl) {

        $("#stuff_name").empty();
        $("#stuff_name").append("<label>"+stuffName+"</label>");
        $("#stuff_id").val(stuffid);
        $("#stuff_name_input").val(stuffName);
        $("#selectDoctorModal").modal('hide')

    }
    
    function selectDoctor() {

        $("#selectDoctorModal").modal('show')
    }

    function removeSelectDoctor() {

        $("#stuff_name").empty();
        $("#stuff_id").val("");
        $("#stuff_img").empty();

    }

</script>


</html>
